@import 'bpmn-js/dist/assets/diagram-js.css'; // 基础样式
@import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'; // 节点基础图标
@import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'; // 节点完整图标

// 小地图
// @import 'diagram-js-minimap/assets/diagram-js-minimap.css';
$success-color: #6d9fff;
$success-fill-color: #f6faff;
$current-color: #b66dff;
$current-fill-color: #f2e2ff;
$def-color: #aaaaaa;
$def-fill-color: #fafafa;
$start-color: #72e2a6;
$start-fill-color: #e4ffef;
$refuse-color: #f78080;
$refuse-fill-color: #fff0f1;
$end-color: #f5d637;
$end-fill-color: #fffbe4;
.designer {
  flex: 1;
  &-readonly {
    .djs-shape.unset1 {
      .djs-visual rect {
        stroke: $def-color !important;
        fill: $def-fill-color !important;
        fill-opacity: 0.7 !important;
      }

      .djs-visual polygon {
        fill: $def-fill-color !important;
        stroke: $def-color !important;
      }

      .djs-visual circle {
        stroke: $def-color !important;
        fill: $def-fill-color !important;
        fill-opacity: 0.7 !important;
      }
      .djs-visual path {
        stroke: $def-color !important;
        fill: $def-color !important;
      }
    }
    .djs-shape.unset2 {
      .djs-visual > svg {
        g {
          filter: none;
          &:nth-child(1) {
            path {
              stroke: $def-color !important;
              fill: $def-fill-color !important;
              fill-opacity: 0.7 !important;
            }
            rect {
              stroke: $def-color !important;
              fill: $def-fill-color !important;
              fill-opacity: 0.7 !important;
            }
          }
          &:nth-child(2) {
            path {
              stroke: none;
              fill: none;
            }
            rect {
              stroke: none;
              fill: none;
            }
          }
        }
      }
    }
  }
}
.djs-parent {
  --color-blue-205-100-50: hsla(216, 97%, 87%, 1);
  .djs-outline,
  .djs-selection-outline {
    stroke-dasharray: 3, 3;
  }
}
.djs-minimap div.toggle {
  display: none;
}

// 修复选中时填充色
.layer-selectionOutline {
  fill: none;
}

.success-arrow {
  fill: $success-color;
  stroke: $success-color;
}

.success-conditional {
  fill: white;
  stroke: $success-color;
}

.success.djs-connection {
  .djs-visual path {
    stroke: $success-color !important;
    marker-end: url(#success-path-end) !important;
    marker-start: url(#success-circle-start) !important;
  }
}

// .success.djs-connection.condition-expression {
//   .djs-visual path {
//     marker-start: url(#conditional-flow-marker-white-success) !important;
//   }
// }

.success2.djs-shape {
  .djs-visual > svg {
    g {
      filter: none;
      &:nth-child(1) {
        path {
          stroke: $success-color !important;
          fill: $success-fill-color !important;
          fill-opacity: 0.7 !important;
        }
        rect {
          stroke: $success-color !important;
          fill: $success-fill-color !important;
          fill-opacity: 0.7 !important;
        }
      }
    }
  }
}

.success1.djs-shape {
  .djs-visual rect {
    stroke: $success-color !important;
    fill: $success-fill-color !important;
    fill-opacity: 0.7 !important;
  }

  .djs-visual polygon {
    stroke: $refuse-color !important;
  }

  .djs-visual path {
    stroke: $success-color !important;
    fill: $success-color !important;
  }

  .djs-visual polygon + path {
    stroke: $refuse-color !important;

    fill: $refuse-color !important;
  }

  .djs-visual circle {
    stroke: $success-color !important;
    fill: $success-fill-color !important;
    fill-opacity: 0.7 !important;
  }
}

.success2.refuse.djs-shape {
  .djs-visual > svg {
    g {
      filter: none;
      &:nth-child(1) {
        rect {
          stroke: $refuse-color !important;
          fill: $refuse-fill-color !important;
          fill-opacity: 0.7 !important;
        }
      }
      &:nth-child(3) {
        path {
          stroke: $refuse-color !important;
          fill: $refuse-color !important;
        }
      }
    }
  }
}
.end2.djs-shape {
  .djs-visual > svg {
    g {
      filter: none;
      &:nth-child(1) {
        path {
          stroke: $end-color !important;
          fill: $end-fill-color !important;
          fill-opacity: 0.7 !important;
        }
        rect {
          stroke: $end-color !important;
          fill: $end-fill-color !important;
          fill-opacity: 0.7 !important;
        }
      }
    }
  }
}
// .end1.djs-shape {
// }

.current2.djs-shape {
  .djs-visual > svg {
    g {
      filter: none;
      &:nth-child(1) {
        path {
          stroke: $current-color !important;
          fill: $current-fill-color !important;
          fill-opacity: 0.7 !important;
        }
        rect {
          stroke: $current-color !important;
          fill: $current-fill-color !important;
          fill-opacity: 0.7 !important;
        }
      }
    }
  }
}

.current1.djs-shape {
  .djs-visual rect {
    stroke: $current-color !important;
    fill: $current-fill-color !important;
    fill-opacity: 0.7 !important;
  }

  .djs-visual polygon {
    stroke: $current-color !important;
  }

  .djs-visual circle {
    stroke: $current-color !important;
    fill: $current-color !important;
    fill-opacity: 0.15 !important;
  }
  .djs-visual path {
    stroke: $current-color !important;
    fill: $current-color !important;
  }
}
